<!DOCTYPE html>
<!--suppress ALL-->
<!-- saved from url=(0059)http://www.hasbei.com/qa/detail/202008011289396856023027712 -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title th:text="${appMatterT.getMatterTitle()+'-口腔问题-有贝口腔网'}"></title>
    <meta name="keywords" th:content="${appMatterT.getMatterTitle()+'-有贝口腔网,口腔问答,口腔问题'}">
    <meta name="description" th:content="${appMatterT.getMatterTitle()+'-有贝口腔网为用户提供专业的口腔资讯，口腔知识，口腔问题等综合服务型网站'}">
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/css/commone.css">
    <link rel="stylesheet" href="/css/commthree.css">
    <link rel="stylesheet" href="/css/pinglun.css">
    <link rel="stylesheet" media="screen and (min-width:481px)" href="/css/qadetail.css">
    <link rel="stylesheet" media="screen and (max-width:480px)" href="/css/qadetail(1).css">

    <script src="/js/hm.js"></script>
    <script type="text/javascript">
        var basePath = "/";
    </script>
    <!--<script src="/js/common.js"></script>-->
    <script src="/js/jquery-3.5.1.min.js"></script>
    <!--<script src="/js/footfixed.js"></script>-->
    <script src="/js/layer.js"></script>
    <script src="/js/wangEditor.min.js"></script>
    <script src="/js/condetail1.js"></script>
    <script src="/js/qadetail.js"></script>
    <link rel="stylesheet" href="/css/layer(1).css" id="layuicss-layer">
</head>

<body>
<div class="content">

    <!--头部-->
    <div th:replace="common/hasbei_top"></div>
    <div th:replace="~{/answers/answers_type::answers_type}"></div>

    <div class="content-main">

        <input type="hidden" id="no" th:value="1">
        <input type="hidden" id="collectType" value="20">
        <input type="hidden" id="matterId" th:value="${appMatterT.getMatterId()}">

        <div class="box-bg-shadow">
            <div class="qa-top">
                <a class="qa-type" th:href="${'/answers_main/'+appMatterT.getClassifyId()}" th:text="${appMatterT.getClassifyT().getClassifyName()}"></a>
                <!-- <a class="ansower-type qa-type" href="#">已回答</a>  -->
                <a class="ansower-type" th:href="${'/answers_ptl/'+appMatterT.getMatterId()}">
                    <img th:src="${appMatterT.getAppUserT().getImgPath()}" alt="有贝口腔网">
                    <span th:text="${appMatterT.getAppUserT().getUserNickname()}"></span>
                </a>
                <a class="please-ansower" href="javascript:;"> 遇到下面问题，需要你帮忙解答</a>
            </div>

            <div class="qa-title" th:text="${appMatterT.getMatterTitle()}"></div>

            <div class="qa-bg">
                <span class="title-text">[问题背景]：</span>
                <div class="bg-content">
                    <p th:text="${appMatterT.getMatterContent()}">
                    </p>
                </div>
                <div class="shou-all-bg" style="">
                    <div class="bg-div"></div>
                    <span>展开全部</span>
                </div>
            </div>

            <div class="qa-info-share">
                <div class="qa-info">

                    <a href="javascript:;" class="huida-num">
                        <img src="/icon/icon_News.png" alt="有贝口腔网">
                        <span><span th:text="${appMatterT.getAnswerCount()}"></span>个回答</span>
                    </a>
                    <a href="javascript:;" class="thumbs-up">
                        <img src="/icon/icon_Browse.png" alt="有贝口腔网">
                        <span><span th:text="${appMatterT.getReadCount()}"></span>阅读</span>
                    </a>

                    <a href="javascript:;" class="conllection" onclick="myCollect(this)">
                        <img src="/icon/shoucang1.png" alt="有贝口腔网">
                        <span id="collectType20">收藏问题(<span th:text="${appMatterT.getCollectCount()}"></span>)</span>
                    </a>
                    <span class="time" th:text="${#dates.format(appMatterT.getGroundTime(),'yyyy-MM-dd')}"></span>
                </div>
            </div>

            <div class="editor-div">
                <div id="editor2">
                    <p class="tip-text" style="color: #999">请输入相关口腔文章、资讯内容</p>
                </div>
                <div class="edditor-bottom">
                    <div>字数 <span class="length">0</span></div>
                    <div class="sub-btn">发表回答</div>
                </div>
            </div>

            <div class="qa-info-list">
                <div class="qa-list-top">
                    <span><em>0</em>&nbsp;个回答</span>
                </div>

                <div id="myContent">
                    回答内容
                </div>

                <div class="more-content">
                    <div class="load-more" style="display:none">
                        <img src="/img/load-more.gif" alt="有贝口腔网">
                        <span>加载中</span>
                    </div>

                    <div class="no-data" th:if="${appMatterT.getAnswerCount()==0}">还没有人回答该问题哦，需要您来帮忙回答~</div>
                </div>
            </div>

        </div>


        <div class="aside-left">

            <div class="wonderful-top">
                <div class="wonderful-top-title">
                    <img src="/img/Linkeddatabases.png" alt="有贝口腔网">
                    <span>相关问题</span>
                </div>

                <div class="aside-qa-list" th:each="answer:${answerRe}">

                    <a th:href="${'/answers_ptl/'+answer.getMatterId()}"><span class="aside-qa-title" th:text="${answer.getMatterTitle()}"></span></a>
                    <a th:href="${'/answers_ptl/'+answer.getMatterId()}"><span
                            class="aside-qa-ansower"><span th:text="${answer.getAnswerCount()}"></span>个回答</span></a>

                </div>

            </div>

            <div class="wonderful-top">
                <div class="wonderful-top-title">
                    <!-- <img src="/static/images/rmd.png" alt="有贝口腔网"> -->
                    <span>大家都在问</span>
                </div>
                <div class="wonderful-ansewer-list">

                    <div class="ansewer-list-item" th:each="matter,userStat:${groundMatters}">
                        <!--th:class="${userStat.index<3?'pink-bg':''}"-->
                        <span th:class="${userStat.index<3?'pink-bg':''}" th:text="${userStat.index+1}"></span>
                        <div>
                            <a target="_blank" class="ansewer-list-title"
                               th:href="${'/answers_ptl/'+matter.getMatterId()}">口腔发炎怎么治？</a>
                            <div class="ansewer-list-info">
                                <a target="_blank" th:href="${'/answers_ptl/'+matter.getMatterId()}">
                                    <!-- <img src="/static/images/Write.png" alt=""> -->
                                    <span class="ansewer-list-info-ansewer" th:text="${matter.getAnswerCount()>0?'已回答':'未答'}">回答</span>
                                </a>
                                <a target="_blank" th:href="${'/answers_ptl/'+matter.getMatterId()}"><span th:text="${matter.getAnswerCount()}"></span>个回答</a>
                                <span class="dotted"></span>
                                <a target="_blank" th:href="${'/answers_ptl/'+matter.getMatterId()}"><span th:text="${matter.getReadCount()}"></span>-阅读</a>
                            </div>
                        </div>

                    </div>
                </div>
            </div>

        </div>

    </div>
    <!--尾部-->
    <div th:replace="common/hasbei_bottom"></div>
    <script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?4245936cbef31e434e2b387b56dfd7d8";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>


</div>
</body>

<script type="text/javascript">

    //编辑器
    var E = window.wangEditor;
    var editor = new E('#editor2');
    editor.customConfig.uploadImgShowBase64 = true   // 使用 base64 保存图片
    // 将图片大小限制为 1M
    editor.customConfig.uploadImgMaxSize = 1 * 1024 * 1024;
    editor.customConfig.uploadFileName = 'upfile';
    // 将 timeout 时间改为 10s
    editor.customConfig.uploadImgTimeout =10000;
    editor.customConfig.customAlert = function (info) {//自定义错误提示信息
        layer.msg(info);
    }

    editor.customConfig.menus = [
        'head',  // 标题
        'bold',  // 粗体
        'fontSize',  // 字号
        'fontName',  // 字体
        'italic',  // 斜体
        'underline',  // 下划线
        'strikeThrough',  // 删除线
        'foreColor',  // 文字颜色
        'backColor',  // 背景颜色
        'link',  // 插入链接
        'list',  // 列表
        'justify',  // 对齐方式
        'quote',  // 引用
        //'emoticon',  // 表情
        'image',  // 插入图片
        'table',  // 表格
        //'video',  // 插入视频
        // 'code',  // 插入代码
        'undo',  // 撤销
        'redo'  // 重复
    ]

    editor.customConfig.onchangeTimeout = 1 // 单位 ms

    editor.customConfig.pasteTextHandle = function (content) {
        return delHtmlTag(content);//去除复制带来的标签代码
    }

    editor.customConfig.onchange = function () {
        var articallength =editor.txt.text().length;
        $(".length").text(articallength);
    }

    editor.customConfig.onfocus = function () {
        $(".tip-text").remove();
    }

    editor.create();

    $(".sub-btn").click(function(){
        $(".tip-text").remove();
        var content = editor.txt.text();
        var content=editor.txt.html();
        console.log(content)
        if(content == '' || content.length < 10){
            layer.msg("请输入回答10以上个字符");
            return false;
        }

        addReply(editor.txt.html());//回复


    });
    function isBlank( str ){
        if ( str == "" || str==null ||str.length==0) return true;
        var regu = "^[ ]+$";
        var re = new RegExp(regu);
        return re.test(str);
    }
    function addReply(content) {
        if(isBlank(content)){
            alert("请输入回答内容");
            return ;
        }
        var essayimg = $("#editor2 img")[0];
        if(essayimg!=null){
            essayimg=essayimg.currentSrc;
        }
        console.log("图片   "+essayimg)


        var matterId=$("#matterId").val();
        var data = {
            matterId,
            content,
            essayimg
        };
        $.ajax({
            type : "POST",
            url : "/qaAddReply?t="+new Date().getTime(),
            data : data,
            success : function(data) {
                if (data.code == 201) {
                    layer.msg("恭喜你，回答成功，待审核中");
                    editor.txt.html('');
                } else {
                    layer.msg(data.message);
                }
            },
            error: function(XMLHttpRequest, textStatus, errorThrown){
                alert("链接错误,请联系管理员");
            }
        });
    }


    //===评论事件
    $(function(){
        qaPinglunInitEv();
        initOverflow();
    })

    function qaPinglunInitEv(){
        $(".asdn").hide();
        $(".show-all").unbind("click");
        $(".show-all").click(function(){
            $(".asdn").show();
            $(this).hide();
        })


        $(".pinglun").hide();
        $(".five").unbind("click");
        $(".five").click(function(){//点击评论展开评论内容
            if($(this).parent().next().is(':hidden')){//如果是隐藏就就显示
                $(".pinglun").hide();//先隐藏其他已展开的评论
                $(this).parent().next().show();//再次展开自己
            }else{//因此
                $(this).parent().next().hide();
            }
        });
    }

    function initOverflow(){
        // 太长隐藏点击展开
        $(".show-all").hide();
        $(".list-item-content").each(function (i,dom){
            if($(this).height() > 300){
                $(this).next().show();
                $(this).addClass("overflow-content");
            }else{
                $(this).next().hide();
                $(this).removeClass("overflow-content");
            }
        })
        $(".show-all").click(function(){
            $(this).prev(".list-item-content").removeClass("overflow-content");
            $(this).hide();
        })

        //问题背景隐藏
        $(".shou-all-bg").hide();
        if($(".bg-content").height() > 100){
            $(".bg-content").addClass("qa-bg-show");
            $(".shou-all-bg").show();
        }
        $(".shou-all-bg").click(function(){
            $(".bg-content").removeClass("qa-bg-show");
            $(this).hide();
        })
    }



</script>




</html>